// components/tuBiao/charts/index.js
import * as echarts from '../../../ec-canvas/echarts.min';
Component({
  /**
   * 组件的属性列表
   * @param {charts} 显示图表数据
   */
  properties: {
    /**
     * 图标显示数据
     * @param {value} 显示数据
     * @param {name} 显示名字
     */
    charts: {
      type: Array,
      value: []
    },
  },

  /**
   * 组件的初始数据
   */
  data: {
    ec: {
      onInit: null
    },
  },
  // 生命周期
  lifetimes: {
    attached: function () {
      // 在组件实例进入页面节点树时执行
      let _this = this
      const initChart = function (canvas, width, height, dpr) {
        const chart = echarts.init(canvas, null, {
          width: width,
          height: height,
          devicePixelRatio: dpr, // new
        });
        canvas.setChart(chart);
        var option = {
          tooltip: {
            trigger: 'item'
          },
          legend: {
            z: -1,
          },
          series: [{
            name: '详情',
            type: 'pie',
            radius: '50%',
            label:{
              normal:{
                textStyle:{
                  fontSize:10
                }
              }
            },
            emphasis: {
              itemStyle: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)',
              }
            }
          }]
        };
        //数据赋值
        option.series[0].data = _this.data.charts
        chart.setOption(option);
        return chart;
      }
      this.setData({
        ['ec.onInit']: initChart
      })
    },
  },
})